﻿<!--
    CREATED BY OLIVER CHRISTENSEN & TOMMY MIKKELSEN
    GitHub: Creoludifico
    Plex Forum: omc1000
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <title>WebTools</title>
    <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1">

    <link rel="icon" type="image/x-icon" href="icons/favicon.ico">

    <!--EXTERNAL CSS INIT-->
    <link rel="stylesheet" type="text/css" href="external/css/bootstrap.min.css">
    <!-- No CSS preprocessor so no mapping for now -->
    <link rel="stylesheet" type="text/css" href="external/css/bootstrap-theme.min.css">
    <link rel="stylesheet" type="text/css" href="external/css/font-awesome.min.css">

    <!--EXTERNAL SCRIPT INIT-->
    <script src="external/scripts/jquery-3.1.1.min.js"></script>
    <script src="external/scripts/bootstrap.min.js"></script>

    <!-- STATIC -->
    <link rel="stylesheet" type="text/css" href="static/_shared/global.css" />
    <link rel="stylesheet" type="text/css" href="static/head/head.css" />
    <link rel="stylesheet" type="text/css" href="static/login/login.css" />
    <link id="themeCSS" rel="stylesheet" type="text/css" href="custom_themes/WhiteBlue.css" />
    <!-- No Auth = always WhiteBlue -->
    <script src="static/login/login.js"></script>
</head>

<body>
    <!-- Strings to translate -->
    <p hidden translate>Signing in towards plex.tv</p>
    <p hidden translate>Use your regular Plex credentials</p>
    <p hidden translate>PMS is not connected to plex.tv</p>
    <p hidden translate>Sign in with your local password</p>
    <p hidden translate>Create a local password</p>
    <p hidden translate>Username</p>
    <p hidden translate>Password</p>
    <p hidden translate>Password again</p>
    <p hidden translate>Sign in</p>
    <p hidden translate>Create password</p>
    <p hidden translate>Wrong username and/or password</p>
    <p hidden translate>Signing in towards plex.tv</p>
    <p hidden translate>Wrong password</p>
    <p hidden translate>The passwords does not match</p>
    <p hidden translate>New Version available</p>
    <p hidden translate>New Version:</p>
    <p hidden translate>Release Notes:</p>
    <p hidden translate>Continue</p>
    <p hidden translate>Download Latest</p>
    <p hidden translate>WebTools not available... Please contact Devs!</p>
    <!-- Strings to translate end -->
    <webtools-loading style="display:none;">
        <div class="webtoolsLoading fa fa-cog fa-spin fa-3x fa-fw"></div>
    </webtools-loading>
    <div class="head">
        <div class="title" id="webtoolsVersion">Loading...</div>
    </div>
    <div id="main" class="jumbotron vertical-center">
        <div class="mainContainer">
            <div class="row">
                <div class="col-sm-12 textCenter textBold600">
                    <div id="plexOnlineContainer" style="display: none;">
                        <div id="signInTowardsPlex">
                            <!--Signing in towards plex.tv-->
                        </div>
                        <div id="useRegularPlex">
                            <!--Use your regular Plex credentials-->
                        </div>
                    </div>
                    <div id="plexOfflineContainer">
                        <div id="plexIsOffline">
                            <!--Plex.tv is offline-->
                        </div>
                        <div id="signInLocalPassword" style="display: none;">
                            <!--Sign in with your local password-->
                        </div>
                        <div id="createLocalPassword">
                            <!--Create a local password-->
                        </div>
                    </div>
                </div>
            </div>
            <div id="usernameContainer" style="display: none;">
                <div class="row pushTopMinor">
                    <div class="col-sm-12" id="username">
                        <!--Username-->
                    </div>
                </div>
                <div class="row pushTopTrivial">
                    <div class="col-sm-12"><input type="text" placeholder="Username" name="user" class="form-control" /></div>
                </div>
            </div>
            <div id="passwordContainer">
                <div class="row pushTopTrivial">
                    <div class="col-sm-12" id="password">
                        <!--Password-->
                    </div>
                </div>
                <div class="row pushTopTrivial">
                    <div class="col-sm-12"><input type="password" placeholder="Password" name="pwd" class="form-control" /></div>
                </div>
            </div>
            <div id="repasswordContainer">
                <div class="row pushTopTrivial">
                    <div class="col-sm-12" id="passwordagain">
                        <!--Password again-->
                    </div>
                </div>
                <div class="row pushTopTrivial">
                    <div class="col-sm-12"><input type="password" placeholder="Password again" name="repwd" class="form-control" /></div>
                </div>
            </div>
            <div class="row pushTopMinor">
                <div class="col-sm-12"><input type="submit" value="Sign in" id="login" class="btn btn-primary pull-right mainBtn textBold600" /></div>
            </div>
            <div class="warning" id="wrongUsernamePassword">
                <!--Wrong username and/or password-->
            </div>
            <div class="warning" id="wrongPassword">
                <!--Wrong password-->
            </div>
            <div class="warning" id="passwordDoesntMatch">
                <!--The passwords does not match-->
            </div>
            <div class="warning" id="error"></div>
        </div>
    </div>
    <div id="warning" style="display:none;">
        <div class="newReleaseContainer textBold600 pushLeftMinor">
            <div class="row">
                <div class="col-sm-12">
                    <div class="textBold900 pushTopMinor" id="newVersionAvailable">
                        <!--New Version available-->
                    </div>
                    <span id="newVersion"><!--New Version:--></span> <span id="info_Name"></span><br /><br />
                    <span id="releaseNotes"><!--Release Notes:--></span><br />
                    <div id="info_Notes"></div><br />
                    <button type="button" id="info_Continue" class="btn btn-default mainBtn textBold600 pull-left" onclick="document.location.href = basePath"><!--Continue--></button>
                    <button type="button" id="info_Download" class="btn btn-primary mainBtn textBold600 pull-left pushLeftMinor"><!--Download Latest--></button>
                </div>
            </div>
        </div>
    </div>
</body>

</html>